// 读取本地，没有的话写入
let dataList = {
	isRead01: [false, false],
	isRead02: [false, false],
	isRead03: [false, false]
}
let dataList2 = {
	isRead01: [false, false],
	isRead02: [false, false]
}
!localStorage.getItem("messageData") &&
	localStorage.setItem("messageData", JSON.stringify(dataList))
!localStorage.getItem("messageData2") &&
	localStorage.setItem("messageData2", JSON.stringify(dataList2))
let current = 0
reload()
const read = document.querySelector(".read")
// 重新加载
function reload() {
	let locationData = JSON.parse(localStorage.getItem("messageData"))
	dataList = locationData //重新给对象赋值
	let locationData2 = JSON.parse(localStorage.getItem("messageData2"))
	dataList2 = locationData2 //重新给对象赋值
	// 红点
	const redPoint = document.querySelectorAll(".wrapper1 .text1 ul li .point")
	const redPoint2 = document.querySelectorAll(".wrapper2 .textdiv ul li .red")
	//底部红点与空提示
	const rPoint = document.querySelector(".bottomStyle .information a .rPoint")
	const emptyContent = document.querySelector(".emptyContent")

	let isAllRead = true
	let isEmpty = true
	let isEmpty2 = true
	redPoint.forEach(function (item, index) {
		item.style.opacity = locationData[`isRead0${index + 1}`][0] ? 0 : 1
		isAllRead = !locationData[`isRead0${index + 1}`][0] ? false : isAllRead
		item.parentNode.style.display = locationData[`isRead0${index + 1}`][1]
			? "none"
			: "flex"
		isEmpty = !locationData[`isRead0${index + 1}`][1] ? false : isEmpty
	})
	redPoint2.forEach(function (item, index) {
		item.style.opacity = locationData2[`isRead0${index + 1}`][0] ? 0 : 1
		isAllRead = !locationData2[`isRead0${index + 1}`][0] ? false : isAllRead
	})

	//底部大红点状态
	isAllRead && (rPoint.style.opacity = 0)
	if (current) {
		isEmpty2
			? ((emptyContent.style.opacity = 0),
			  (document.querySelector(".read").style.opacity = 1))
			: ((emptyContent.style.opacity = 1),
			  (document.querySelector(".read").style.opacity = 0))
	} else {
		isEmpty
			? ((emptyContent.style.opacity = 1),
			  (document.querySelector(".read").style.opacity = 0))
			: ((emptyContent.style.opacity = 0),
			  (document.querySelector(".read").style.opacity = 1))
	}
}

//点击消息跳转并更改本地数据
const msg = document.querySelectorAll(".wrapper1 .text1 ul li")
const dele = document.querySelectorAll(".wrapper1 .text1 ul li .info a")
const text = document.querySelectorAll(".wrapper1 .text1 ul li .info")
let isSwipe = false
msg.forEach(function (item, index) {
	Transform(item)
	new AlloyFinger(item, {
		swipe: function (evt) {
			evt.direction == "Left" &&
				((isSwipe = true), (dele[index].style.width = 18 / 37.5 + "rem"))
			evt.direction == "Right" &&
				((isSwipe = true), (dele[index].style.width = 0 + "px"))
		}
	})
})
text.forEach(function (item, index) {
	item.addEventListener("touchend", function () {
		if (!isSwipe) {
			dataList[`isRead0${index + 1}`][0] = true
			localStorage.setItem("messageData", JSON.stringify(dataList))
			location.href = "./details.html"
		}
		isSwipe = false
	})
})

//全部已读
read.addEventListener("touchstart", function () {
	if (!current) {
		for (const key in dataList) {
			dataList[key][0] = true
			localStorage.setItem("messageData", JSON.stringify(dataList))
			reload()
		}
	} else {
		for (const key in dataList2) {
			dataList2[key][0] = true
			localStorage.setItem("messageData2", JSON.stringify(dataList2))
			reload()
		}
	}
})

dele.forEach(function (item, index) {
	item.addEventListener("touchstart", function () {
		dataList[`isRead0${index + 1}`][1] = true
		localStorage.setItem("messageData", JSON.stringify(dataList))
		reload()
	})
})
//点击顶部按钮
const left = document.querySelector(".header .left")
const line = document.querySelector(".header .line")
const right = document.querySelector(".header .right")
const wrapper1 = document.querySelector(".wrapper1")
const wrapper2 = document.querySelector(".wrapper2")
left.addEventListener("touchstart", function () {
	wrapper1.style.display = "block"
	wrapper2.style.display = "none"
	wrapper2.style.opacity = 0
	line.style.left = left.offsetLeft / 37.5 + "rem"
	line.style.width = left.offsetWidth / 37.5 + "rem"
	current = 0
	reload()
})
right.addEventListener("touchstart", function () {
	wrapper1.style.display = "none"
	wrapper2.style.display = "block"
	wrapper2.style.opacity = 1
	line.style.left = right.offsetLeft / 37.5 + "rem"
	line.style.width = right.offsetWidth / 37.5 + "rem"
	current = 1
	reload()
	// document.querySelector(".emptyContent").style.opacity = 0
	// document.querySelector(".read").style.opacity = 1
})

teskBtn.addEventListener("touchstart", function () {
	location.href = "../module04/mainFunctionPage.html"
})
mineBtn.addEventListener("touchstart", function () {
	location.href = "../module04/home.html"
})

const textAll = document.querySelectorAll(".wrapper2 .textdiv")
const gotoAll = document.querySelectorAll(".wrapper2 .textdiv ul li .view")
textAll.forEach(function (item, index) {
	item.addEventListener("touchstart", function () {
		dataList2[`isRead0${index + 1}`][0] = true
		localStorage.setItem("messageData2", JSON.stringify(dataList2))
		document.querySelectorAll(".wrapper2 .textdiv ul .up .red")[
			index
		].style.opacity = 0
	})
})
gotoAll.forEach(function (item) {
	item.addEventListener("touchstart", function () {
		location.href = "../module04/mainFunctionPage.html"
	})
})
